<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>拜访成功率统计表</title>
    <link rel="stylesheet" href="../../../css/wx/mui.min.css">
    <link rel="stylesheet" href="../../../css/wx/app.css"/>
    <link rel="stylesheet" href="../../../css/wx/style.css"/>
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_800797_6xh5hyil09o.css">
    <script type="text/javascript">
        var pageConfig = {
            jss: ["app/bb_bfcgl/bfcgl"]
        };
    </script>
    <script data-main="../../../js/wx/public/config" src="../../../js/require.js"></script>
    <style>
        body, .mui-content {
            background-color: #fff;
        }

        .mui-content {
            padding: 0;
        }

        .mui-scroll-wrapper {
            top: 0px;
        }

        .echartBox {
            margin-top: 10px;
            height: 240px;
            width: 100%;
            box-shadow: 0 4px 2px 0 rgba(88, 86, 86, 0.14), 0 1px 1px 0 rgba(234, 227, 227, 0.12), 0 2px 2px -1px rgba(113, 111, 111, 0.3);
        }

        .echartBox img {
            width: 100%;
            display: block;
        }

        h4.tableTitle {
            text-align: center;
            padding: 30px 10px 10px;
            position: relative;
        }

        h4.tableTitle small {
            position: absolute;
            font-weight: 100;
            right: 10px;
            bottom: 12px;
            font-size: 12px;
        }

        .fo-group {
            font-size: 14px;

        }

        #filter > form {
            background: #fff;
        }

        .pull {
            background: #fff;
        }

        .table table{
            border-right: 2px solid #ccc;
        }
        .table table tr:nth-child(2) td {
            background: #f5f4f4;
        }

    </style>
</head>
<body>
<div class="mui-content">
    <div class="mui-scroll-wrapper">
        <div class="mui-scroll">
            <!--筛选条件-->
            <div class="mui-table-view">
                <form class="mui-input-group" style="margin-bottom: 10px;margin-top: -4px;">
                    <div class="mui-input-row">
                        <label>起始日期：</label>
                        <input id="startDate" v-model="startDate" type="date" class="mui-input-clear">
                    </div>
                    <div class="mui-input-row">
                        <label>截止日期：</label>
                        <input id="endDate" v-model="endDate" type="date" class="mui-input-clear">
                    </div>
                </form>
            </div>

            <div class="echartBox">
                <div id="divChart" style="height: 100%;width: 100%"></div>
            </div>
            <h4 class="tableTitle">
                拜访成功率统计表
                <small><b>单位：家</b></small>
            </h4>
            <div>
                <div id="dataList">
                    <div class="table" style="margin-bottom: 50px;">
                        <table cellpadding="0" cellspacing="0" width="100%">
                            <tr>
                                <th>人员</th>
                                <th>成交家数</th>
                                <th>拜访家数</th>
                                <th>成功率</th>
                            </tr>
                            <tr v-for="v in list" style="text-align: center;">
                                <td>{{v.NAME}}</td>
                                <td>{{v.finish}}</td>
                                <td>{{v.COUNT}}</td>
                                <td>{{v.percent}}</td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>